Applying Palettes to Waterfall 3D Charts

Examples for the Waterfall 3D Chart can be found in the SciChart WPF Examples Suite which can be downloaded from the SciChart Website or our SciChart.WPF.Examples Github Repository.

The Waterfall chart obeys Palette rules similar to that of the 3D SurfaceMesh Chart. Please have a look at this article for SurfaceMesh palettes to see the types of palette available and how to declare them. Palettes which may be applied to the 3D Waterfall chart include:

SolidColorBrushPalette - applies a solid color the waterfall slice or stroke
GradientColorPalette - maps a LinearGradientBrush to the slice or stroke, where heights map to successive colors.

Applying Palettes to the Waterfall Slice Fill

The properties which allow paletteing of the Waterfall Slices are WaterfallRenderableSeries3D.ZColorMapping or YColorMapping.

These proeprties are mutually exclusive, you should set one or the other to apply palettes in the Z direction or Y direction.

As an example of how to apply a GradientColorPalette to the Y-direction (up), see below:

XAML
CS

<s3D:SciChart3DSurface x:Name="SciChart" 
                       BorderThickness="0"
                       WorldDimensions="200,100,200">
  <s3D:SciChart3DSurface.Camera>
    <s3D:Camera3D ZoomToFitOnAttach="True" />
  </s3D:SciChart3DSurface.Camera>
  <s3D:SciChart3DSurface.RenderableSeries>
    <s3D:WaterfallRenderableSeries3D x:Name="WaterfallSeries" Stroke="#AA3333FF" Opacity="0.8" StrokeThickness="1" SliceThickness="1">       
        <s3D:WaterfallRenderableSeries3D.YColorMapping>
             <!-- A GradientColorPalette is applied to the YColorMapping property -->
             <s3D:GradientColorPalette x:Key="GradientColorPalette" IsStepped="False">
                <s3D:GradientColorPalette.GradientStops>
                  <!-- Maximum values in the Waterfall will be red -->
                  <GradientStop Offset="0" Color="Red"/>
                  <GradientStop Offset="0.25" Color="Orange"/>
                  <GradientStop Offset="0.5" Color="Yellow"/>
                  <GradientStop Offset="0.75" Color="Green"/>
                  <!-- Minimum values in the Waterfall will be Red -->
                  <GradientStop Offset="1" Color="DarkGreen"/>
                </s3D:GradientColorPalette.GradientStops>
              </s3D:GradientColorPalette>
        </s3D:WaterfallRenderableSeries3D.YColorMapping>
    </s3D:WaterfallRenderableSeries3D>
  </s3D:SciChart3DSurface.RenderableSeries>
  <s3D:SciChart3DSurface.XAxis>
    <s3D:NumericAxis3D/>
  </s3D:SciChart3DSurface.XAxis>
  <s3D:SciChart3DSurface.YAxis>
    <s3D:NumericAxis3D/>
  </s3D:SciChart3DSurface.YAxis>
  <s3D:SciChart3DSurface.ZAxis>
    <s3D:LogarithmicNumericAxis3D TextFormatting="#.#E+0"
                                  LogarithmicBase="10"
                                  AutoRange="Always"
                                  ScientificNotation="LogarithmicBase"/>
  </s3D:SciChart3DSurface.ZAxis>

private void OnLoaded(object sender, RoutedEventArgs routedEventArgs)
{
    var pointsPerSlice = 100;
    var sliceCount = 20;
    var logBase = 10;
    var slicePositions = new double[sliceCount];
    for (int i = 0; i < sliceCount; ++i)
    {
        slicePositions[i] = Math.Pow(logBase, i);
    }
   
    var dataSeries = new WaterfallDataSeries3D<double>(pointsPerSlice, slicePositions) { SeriesName = "Waterfall" };
    dataSeries.StartX = 10;
    dataSeries.StepX = 1;
    for (int sliceIndex = 0; sliceIndex < sliceCount; ++sliceIndex)
    {       
        for (var pointIndex = 0; pointIndex < pointsPerSlice; pointIndex++)
        {           
            dataSeries[sliceIndex, pointIndex] = // TODO Create some data to apply to the waterfall chart// ;
        }
    }
    WaterfallSeries.DataSeries = dataSeries;
}

This will result in the following output:

If the same GradientColorPalette is applied in the Z-direction, then you get this effect.

Also, the Waterfall3D Chart will accept SolidColorBrushPalette, which allows you to set a constant color for each slice.

Applying Palettes to the Waterfall Slice Stroke (Outline)

NEW! New feature to SciChart WPF v5.4.0

A new feature in SciChart WPF v5.4.0 allows you to apply a BrushColorPalette to the Stroke outline of Waterfall 3D Charts, which can be either a GradientColorPalette or a SolidColorBrushPalette.

The Brush may be set in the Y direction (Up) or the Z direction (horizontally) as follows:

XAML
CS

<s3D:SciChart3DSurface x:Name="SciChart" 
                       BorderThickness="0"
                       WorldDimensions="200,100,200">
  <s3D:SciChart3DSurface.Camera>
    <s3D:Camera3D ZoomToFitOnAttach="True" />
  </s3D:SciChart3DSurface.Camera>
  <s3D:SciChart3DSurface.RenderableSeries>
    <s3D:WaterfallRenderableSeries3D x:Name="WaterfallSeries" Stroke="#AA3333FF" Opacity="0.8" StrokeThickness="1" SliceThickness="1">       
        <s3D:WaterfallRenderableSeries3D.ZStrokeColorMapping>
             <!-- A GradientColorPalette is applied to the ZStrokeColorMapping property -->
             <s3D:GradientColorPalette x:Key="GradientColorPalette" IsStepped="False">
                <s3D:GradientColorPalette.GradientStops>
                  <!-- Minimum value in Z will be Red --> 
                  <GradientStop Offset="0" Color="Red"/>
                  <GradientStop Offset="0.25" Color="Orange"/>
                  <GradientStop Offset="0.5" Color="Yellow"/>
                  <GradientStop Offset="0.75" Color="Green"/>
                  <GradientStop Offset="1" Color="DarkGreen"/>
                  <!-- Maximum value in Z will be green --> 
                </s3D:GradientColorPalette.GradientStops>
              </s3D:GradientColorPalette>
        </s3D:WaterfallRenderableSeries3D.ZStrokeColorMapping>
    </s3D:WaterfallRenderableSeries3D>
  </s3D:SciChart3DSurface.RenderableSeries>
  <s3D:SciChart3DSurface.XAxis>
    <s3D:NumericAxis3D/>
  </s3D:SciChart3DSurface.XAxis>
  <s3D:SciChart3DSurface.YAxis>
    <s3D:NumericAxis3D/>
  </s3D:SciChart3DSurface.YAxis>
  <s3D:SciChart3DSurface.ZAxis>
    <s3D:LogarithmicNumericAxis3D TextFormatting="#.#E+0"
                                  LogarithmicBase="10"
                                  AutoRange="Always"
                                  ScientificNotation="LogarithmicBase"/>
  </s3D:SciChart3DSurface.ZAxis>

private void OnLoaded(object sender, RoutedEventArgs routedEventArgs)
{
    var pointsPerSlice = 100;
    var sliceCount = 20;
    var logBase = 10;
    var slicePositions = new double[sliceCount];
    for (int i = 0; i < sliceCount; ++i)
    {
        slicePositions[i] = Math.Pow(logBase, i);
    }
   
    var dataSeries = new WaterfallDataSeries3D<double>(pointsPerSlice, slicePositions) { SeriesName = "Waterfall" };
    dataSeries.StartX = 10;
    dataSeries.StepX = 1;
    for (int sliceIndex = 0; sliceIndex < sliceCount; ++sliceIndex)
    {       
        for (var pointIndex = 0; pointIndex < pointsPerSlice; pointIndex++)
        {           
            dataSeries[sliceIndex, pointIndex] = // TODO Create some data to apply to the waterfall chart// ;
        }
    }
    WaterfallSeries.DataSeries = dataSeries;
}

Combinations of Solid, Gradient color Fill and Stroke can be applied to get the desired effect on a waterfall chart.